<template>
    <div>
        <el-card>
            <el-button @click="isshowDialog = true">添加分类</el-button>
            <el-table :data="tableData" style="width: 100%">
                <el-table-column label="ID" prop="id"> </el-table-column>
                <el-table-column label="分类标题" prop="title">
                </el-table-column>
                <el-table-column fixed="right" label="操作" width="120">
                    <template slot-scope="scope">
                        <el-button
                            @click="delCategory(scope.row.id)"
                            type="text"
                            size="small"
                        >
                            删除
                        </el-button>
                    </template>
                </el-table-column>
            </el-table>
        </el-card>
        <el-dialog title="图片预览" :visible.sync="isshowDialog" width="30%" >
            <el-form ref="addFormRef" label-width="80px">
                <el-form-item label="分类标题">
                    <el-input
                        placeholder="请输入标题"
                        v-model="title"
                    ></el-input>
                </el-form-item>
            </el-form>
			<div slot="footer">
				<el-button type="primary" @click="addCategory">增加</el-button>
			</div>
        </el-dialog>
    </div>
</template>

<script>
import {getCategory, delCategory, addCategory } from "network/request.js";

export default {
    created() {
        this.getlist();
    },
    data() {
        return {
            isshowDialog: false,
            isshow: true,
            tableData: [],
			title: "",
        };
    },
    methods: {
		getlist() {
			const params = {
				url: '/category/get',
				method: 'get',
			};
			getCategory(params).then(res => {
				this.tableData = res.content;
			});
        },
		addCategory() {
			const params = {
				data: {
					title: this.title,
				},
				url: '/admin/category/add',
				method: 'post',
			};
			addCategory(params).then(res => {
				this.$message.success('添加成功！');
				this.getlist();
				this.isshowDialog = false;
			})
		},
		delCategory(id) {
			this.$confirm(`删除后不可恢复，是否确定`, '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning',

				}).then(() => {
					const params = {
						url: '/admin/category/del',
						method: 'post',
						data: {
							ids: [id],
						},
					};
					delCategory(params).then(res => {
						this.$message.success('删除成功! ');
						this.getlist();
					});
				}).catch(() => {

				});
			
        },
    },
};
</script>

<style lang="scss" scoped>
</style>